<template>
  <div class="container">
    <div class="search-box">
      <el-row :gutter="20">
        <el-form label-width="100px" size="small" class="searchForm">
          <el-col :span="6">
            <el-form-item label="公司名称:">
              <el-input
                v-model="params.companyName"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户姓名:">
              <el-input
                v-model="params.customerName"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="联系电话:">
              <el-input
                v-model="params.customerPhone"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="更多电话:" v-if="!openFlag">
              <el-input
                v-model="params.landlinePhone"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="城市:">
              <el-input
                v-model="params.city"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户邮箱:" v-if="!openFlag">
              <el-input
                v-model="params.email"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="上级公司:" v-if="!openFlag">
              <el-select @change="search" v-model="params.pid">
                <el-option
                  v-for="item in pidList"
                  :key="item.companyName"
                  :label="item.companyName"
                  :value="item.companyName"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户官网:" v-if="!openFlag">
              <el-input
                v-model="params.officialWebsite"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户等级:">
              <el-select
                v-model="params.grade"
                placeholder="请选择客户等级"
                size="mini"
                clearable
                @change="search"
              >
                <el-option
                  v-for="item in levelList"
                  :key="item.gradeValue"
                  :label="item.gradeName"
                  :value="item.gradeValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="6">
            <el-form-item label="来源:">
              <el-select v-model="params.source" clearable @change="search">
                <el-option
                  v-for="item in levelList5"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="标签:">
              <!-- <el-autocomplete
                class="inline-input"
                v-model="params.label"
                :fetch-suggestions="querySearch"
                placeholder="请输入内容"
                value-key="context"
                clearable
                @change="search"
              ></el-autocomplete> -->
              <el-select
                v-model="params.label"
                clearable
                placeholder="请选择标签"
                @change="search"
              >
                <el-option
                  v-for="item in labels"
                  :key="item.id"
                  :label="item.context"
                  :value="item.context"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <!-- <el-col :span="6">
            <el-form-item label="新/老客户:" v-if="!openFlag">
              <el-select
                v-model="params.customerType"
                clearable
                @change="search"
              >
                <el-option
                  v-for="item in typeList1"
                  :key="item.id"
                  :label="item.title"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <el-col :span="6">
            <el-form-item label="客户类型:" v-if="!openFlag">
              <el-select
                v-model="params.customerRole"
                clearable
                @change="search"
              >
                <el-option
                  v-for="item in levelList3"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="最近跟进人:" v-if="!openFlag">
              <!-- <el-input
                v-model="params.userName"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input> -->
              <el-select v-model="params.ids" clearable @change="search">
                <el-option
                  v-for="item in sysUserList"
                  :key="item.userId"
                  :label="item.userName"
                  :value="item.userId"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="未联系(天):" v-if="!openFlag">
              <el-input
                clearable
                v-model="params.day"
                @change="search"
                :min="1"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" v-if="openFlag">
            <el-button
              @click="search"
              icon="el-icon-search"
              size="mini"
              type="warning"
              >搜索</el-button
            >
            <el-button
              icon="el-icon-folder-opened"
              type="primary"
              size="mini"
              @click="openSearch"
              >展开</el-button
            >
            <el-button
              @click="cancelData"
              icon="el-icon-circle-close"
              size="mini"
              type="success"
              >重置</el-button
            >
          </el-col>
          <el-col :span="6" v-if="!openFlag">
            <el-button
              @click="search"
              icon="el-icon-search"
              type="warning"
              size="mini"
              >搜索</el-button
            >
            <el-button
              @click="openSearch"
              icon="el-icon-folder-opened"
              type="primary"
              size="mini"
              >收起</el-button
            >
            <el-button
              @click="cancelData"
              icon="el-icon-circle-close"
              size="mini"
              type="success"
              >重置</el-button
            >
          </el-col>
        </el-form>
      </el-row>
    </div>

    <div>
      <div class="handle-box">
        <el-button
          size="mini"
          type="danger"
          icon="el-icon-delete"
          class="handle-del mr10"
          :disabled="multiple"
          @click="delAllSelection"
          >批量删除</el-button
        >
        <el-button
          size="mini"
          type="success"
          icon="el-icon-s-promotion"
          class="handle-del mr10"
          :disabled="multiple"
          @click="translate"
          >批量转移</el-button
        >
        <el-button
          type="warning"
          size="mini"
          icon="el-icon-plus"
          @click="handleAdd"
          class="mr10"
          >新增客户</el-button
        >
        <!-- 管理员上传 -->
        <!-- <el-upload
          v-loading="uploading"
          class="mr10"
          style="display: inline-block; margin-top: 10px"
          action
          :http-request="uploadFile1"
          :limit="1"
          :on-exceed="fileExceed"
          accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
          :file-list="uploadList"
          :show-file-list="false"
          ref="fileupload"
          v-hasPermi="['systemSettings:customerManagement:upUsre']"
        >
          <el-button size="mini" type="success" class="el-icon-s-promotion"
            >管理员资源导入</el-button
          >
        </el-upload> -->
        <!-- <el-button
          type="danger"
          size="mini"
          icon="el-icon-delete"
          class="mr10"
          @click="allDel(1)"
          >等级删除</el-button
        > -->
        <!-- 普通上传 -->
        <el-upload
          v-loading="uploading"
          class="mr10"
          style="display: inline-block; margin-top: 10px"
          action
          :http-request="uploadFile2"
          :limit="1"
          :on-exceed="fileExceed"
          accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
          :file-list="uploadList"
          :show-file-list="false"
          ref="fileupload"
        >
          <el-button size="mini" type="primary" class="el-icon-s-promotion"
            >资源导入</el-button
          >
        </el-upload>
        <el-button
          type="success"
          size="mini"
          icon="el-icon-view"
          class="mr10"
          @click="diaAppointment"
          >提醒列表
        </el-button>
        <el-button
          type="primary"
          size="mini"
          icon="el-icon-download"
          class="mr10"
          @click="downLoadPan"
          >模板下载</el-button
        >
        <el-button
          type="warning"
          size="mini"
          icon="el-icon-folder-opened"
          class="mr10"
          @click="export1"
          v-hasPermi="['system:customerNei:import']"
        >
          资源导出
        </el-button>
        <el-button
          type="success"
          size="mini"
          icon="el-icon-s-promotion"
          class="mr10"
          @click="toSameCustomer"
          >重复客户
        </el-button>
      </div>
      <el-table
        v-loading="loading"
        :data="tableData"
        :max-height="tableHeight"
        style="width: 100%;"
        border
        class="table"
        ref="multipleTable"
        header-cell-class-name="table-header"
        @selection-change="handleSelectionChange"
        @sort-change="handleSortChange"
      >
        <el-table-column
          type="selection"
          width="55"
          align="center"
        ></el-table-column>
        <el-table-column type="index" fixed align="center" width="50">
        </el-table-column>
        <el-table-column label="公司名称" fixed min-width="260" align="center">
          <template slot-scope="scope">
            <span
              class="blue"
              style="text-decoration: underline; margin-left: 5px"
              @click="handleEdit(scope.$index, scope.row)"
              >{{ scope.row.companyName }}</span
            >
          </template>
        </el-table-column>

        <el-table-column
          prop="customerName"
          label="客户姓名"
          min-width="100"
          align="center"
          fixed
          :show-overflow-tooltip="true"
        ></el-table-column>

        <el-table-column
          label="联系电话"
          width="150"
          fixed
          align="center"
          prop="customerPhone"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="更多电话"
          width="150"
          align="center"
          prop="landlinePhone"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="城市"
          align="center"
          width="100"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <!-- {{ scope.row.continent }}/{{ scope.row.country }}/{{
              scope.row.city
            }}/{{ scope.row.address }} -->
            {{ scope.row.city }}
          </template>
        </el-table-column>
        <el-table-column label="客户类型" align="center" min-width="150">
          <template slot-scope="scope">
            <span>{{ formatRole(scope.row.customerRole) }}</span>
          </template>
        </el-table-column>
        <el-table-column label="标签" min-width="120" align="center">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.label">{{ scope.row.label }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          label="最近小记时间"
          prop="updateTime"
          align="center"
          min-width="120"
          :sortable="'custom'"
        >
          <!-- <template slot-scope="scope">{{ scope.row.updateTime }}</template> -->
          <template slot-scope="scope">{{
            smallTime(scope.row.updateTime)
          }}</template>
        </el-table-column>
        <el-table-column
          label="最近小记内容"
          align="center"
          width="150"
          prop="subtotal"
          :show-overflow-tooltip="true"
        />
        <el-table-column label="来源" align="center" min-width="130">
          <template slot-scope="scope">
            <span>{{ formatSource(scope.row.source) }}</span>
          </template>
        </el-table-column>

        <el-table-column label="客户官网" align="center" min-width="210">
          <template slot-scope="scope">
            <div v-if="scope.row.officialWebsite">
              <div
                v-for="item in scope.row.officialWebsite.split(',')"
                :key="item"
              >
                <a :href="item" target="_blank">{{ item }}</a>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="email"
          label="客户邮箱"
          align="center"
          min-width="160"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column label="客户等级" width="150" align="center">
          <template slot-scope="scope">
            <span>{{ formatLevel(scope.row.grade) }}</span>
          </template>
        </el-table-column>

        <el-table-column
          prop="userName"
          label="最近跟进人"
          align="center"
          width="150"
        ></el-table-column>
        <el-table-column
          label="备注"
          align="center"
          width="150"
          prop="remark"
          :show-overflow-tooltip="true"
        />

        <el-table-column
          label="创建时间"
          prop="createTime"
          align="center"
          min-width="160"
          :sortable="'custom'"
        >
          <template slot-scope="scope">{{ scope.row.createTime }}</template>
        </el-table-column>
        <el-table-column
          label="操作"
          min-width="240"
          align="center"
          fixed="right"
        >
          <template slot-scope="scope">
            <!-- <el-button
              size="mini"
              type="warning"
              icon="el-icon-s-promotion"
              @click="handleOrder(scope.$index, scope.row)"
              >预约</el-button
            > -->
            <el-button
              size="mini"
              type="warning"
              @click="handleOrder(scope.$index, scope.row)"
              >提醒</el-button
            >
            <el-button
              type="primary"
              size="mini"
              @click="handleViewLog(scope.$index, scope.row)"
              >小记</el-button
            >
            <el-button
              type="success"
              size="mini"
              @click="handleEdit(scope.$index, scope.row)"
              >修改</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <pagination
          v-show="pageTotal > 0"
          :total="pageTotal"
          :page.sync="params.pageNum"
          :limit.sync="params.pageSize"
          @pagination="getData00N"
        />
      </div>
    </div>
    <el-dialog
      title="选择转移人"
      :visible.sync="translateVisible"
      width="600px"
    >
      <el-select
        v-model="moveUser"
        placeholder="请选择转移人"
        size="mini"
        clearable
        filterable
      >
        <el-option
          v-for="item in peopleLists"
          :key="item.userId"
          :label="item.userName"
          :value="item.userId"
        ></el-option>
      </el-select>
      <span slot="footer" class="dialog-footer">
        <el-button @click="translateVisible = false" size="small"
          >取消</el-button
        >
        <el-button @click="translate_sub()" type="primary" size="small"
          >确定</el-button
        >
      </span>
    </el-dialog>
    <!-- 客户预约新增 -->
    <el-dialog title="客户预约" :visible.sync="orderVisible" width="500px">
      <el-form
        ref="ruleForm"
        label-width="100px"
        :model="orderData"
        :rules="rules"
      >
        <el-row>
          <el-col :span="24">
            <el-form-item label="生效时间" prop="remainTime">
              <el-date-picker
                v-model="orderData.remainTime"
                type="datetime"
                format="yyyy-MM-dd HH:mm"
                value-format="yyyy-MM-dd HH:mm"
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="备注">
              <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入备注"
                v-model="orderData.remark"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button
          @click="orderSubmitForm('ruleForm')"
          type="primary"
          size="small"
          :loading="isLogin"
          >保存</el-button
        >
      </span>
    </el-dialog>

    <el-dialog
      title="客户预约列表"
      :visible.sync="viewOrderListVisible"
      width="1000px"
    >
      <el-table
        :data="orderLstData"
        class="table"
        border
        header-cell-class-name="table-header"
      >
        <el-table-column
          prop="customerName"
          align="center"
          label="客户姓名"
        ></el-table-column>
        <el-table-column
          prop="companyName"
          align="center"
          width="250"
          label="客户公司"
        ></el-table-column>
        <el-table-column label="预约时间" align="center" width="150">
          <template slot-scope="scope">{{ scope.row.remainTime }}</template>
        </el-table-column>
        <el-table-column label="状态" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.status == 0" style="color: #e66d06"
              >未提醒</span
            >
            <span v-if="scope.row.status == 1" style="color: green"
              >已提醒</span
            >
          </template>
        </el-table-column>
        <el-table-column
          prop="remark"
          align="center"
          label="备注"
        ></el-table-column>
        <el-table-column label="操作" min-width="220" align="center">
          <template slot-scope="scope">
            <el-button
              type="success"
              size="mini"
              icon="el-icon-edit"
              @click="handleOrderListEdit(scope.$index, scope.row)"
              >更新预约</el-button
            >
            <el-button
              type="danger"
              size="mini"
              icon="el-icon-delete"
              @click="handleOrderListDelete(scope.$index, scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <el-pagination
          background
          layout="total, prev, pager, next"
          :current-page="orderParams.pageNum"
          :page-size="orderParams.pageSize"
          :total="orderParamsTotal"
          @current-change="orderPageChange"
        ></el-pagination>
      </div>
    </el-dialog>
    <!-- 修改增加 -->
    <el-dialog
      :title="title666"
      :close-on-click-modal="false"
      :visible.sync="dialogVisible"
      width="1200px"
    >
      <el-form
        :rules="rules2"
        ref="ruleForm"
        :model="formData"
        label-width="120px"
        size="small"
        class="form-box"
      >
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="公司名称" prop="companyName">
              <el-input
                v-model="formData.companyName"
                :disabled="editFlags"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户姓名" prop="customerName">
              <el-input v-model="formData.customerName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="上级公司" prop="pid">
              <el-select filterable v-model="formData.pid">
                <el-option
                  v-for="item in pidList"
                  :key="item.companyName"
                  :label="item.companyName"
                  :value="item.companyName"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="联系电话" prop="customerPhone">
              <el-input v-model="formData.customerPhone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户类型" prop="customerRole">
              <el-select v-model="formData.customerRole">
                <el-option
                  v-for="item in levelList3"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户等级" prop="grade">
              <el-select v-model="formData.grade">
                <el-option
                  v-for="item in levelList"
                  :key="item.gradeValue"
                  :label="item.gradeName"
                  :value="item.gradeValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="来源" prop="source">
              <!-- <el-input v-model="formData.source"></el-input> -->
              <el-select v-model="formData.source" @change="change123">
                <el-option
                  v-for="item in levelList5"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户邮箱" prop="email">
              <el-input v-model="formData.email">
                <el-button
                  slot="append"
                  icon="el-icon-coordinate"
                  @click.stop="yanzheng"
                ></el-button>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户官网" prop="officialWebsite">
              <el-input v-model="formData.officialWebsite"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="更多电话" prop="landlinePhone">
              <el-input v-model="formData.landlinePhone"></el-input>
            </el-form-item>
          </el-col>

          <!-- <el-col :span="8">
            <el-form-item label="新/老客户" prop="customerType">
              <el-select v-model="formData.customerType">
                <el-option
                  v-for="item in levelList2"
                  :key="item.id"
                  :label="item.title"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <el-col :span="8">
            <el-form-item label="标签">
              <el-select
                v-model="formData.label"
                clearable
                placeholder="请选择标签"
              >
                <el-option
                  v-for="item in labels"
                  :key="item.id"
                  :label="item.context"
                  :value="item.context"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="详细地址" prop="address">
              <el-input v-model="formData.address"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="省" prop="country">
              <el-select
                class="mr10"
                v-model="formData.country"
                placeholder="省"
                @change="changeAddress(formData.country, 1)"
                style="width:130px"
              >
                <el-option
                  v-for="item in options1"
                  :key="item.cityName"
                  :label="item.cityName"
                  :value="item.cityName"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="城市" prop="city">
              <el-select
                class="mr10"
                v-model="formData.city"
                placeholder="市"
                @change="changeAddress1(formData.city, 1)"
                style="width:130px"
              >
                <el-option
                  v-for="item in options2"
                  :key="item.cityName"
                  :label="item.cityName"
                  :value="item.cityName"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="县/区" prop="district">
              <el-select
                class="mr10"
                v-model="formData.district"
                placeholder="县"
                style="width:130px"
              >
                <el-option
                  v-for="item in options3"
                  :key="item.cityName"
                  :label="item.cityName"
                  :value="item.cityName"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="16">
            <el-form-item label="备注">
              <el-input type="textarea" autosize v-model="formData.remark">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-if="formData.id">
          <div style="font-size:16px;font-weight:bold;margin:10px 0">
            修改记录：
          </div>
          <el-table
            v-loading="loadingE"
            :data="recordData"
            max-height="300px"
            border
            class="table"
            ref="multipleTable1"
            header-cell-class-name="table-header"
          >
            <el-table-column
              label="修改时间"
              width="150"
              align="center"
              prop="updateTime"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              prop="userName"
              label="修改人"
              width="150"
              align="center"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="修改内容"
              align="center"
              prop="content"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
          </el-table>
          <div style="margin-top:20px" class="pagination">
            <el-pagination
              background
              layout="total, prev, pager, next"
              :current-page="paramsRecord.pageNum"
              :page-size="paramsRecord.pageSize"
              :total="edPageTotal"
              @current-change="edPageChange"
            ></el-pagination>
          </div>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false" size="small">取消</el-button>
        <el-button @click="submitForm()" type="primary" size="small"
          >确定</el-button
        >
      </span>
    </el-dialog>
    <!-- <el-dialog
      title="添加标签"
      :visible.sync="dialogVisible555"
      width="800px"
      @close="close666"
    >
      <el-row>
        <div>
          <span style="display: block; margin-bottom: 10px; font-weight: blod"
            >标签名称:</span
          >
          <el-autocomplete
            class="inline-input"
            v-model="label"
            :fetch-suggestions="querySearch"
            placeholder="请输入内容"
            value-key="context"
            clearable
          ></el-autocomplete>
        </div>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="up" type="primary" size="small">确定</el-button>
      </span>
    </el-dialog> -->
    <el-dialog
      title="添加标签"
      :visible.sync="dialogVisible666"
      width="800px"
      @close="close666"
    >
      <el-row>
        <div>
          <span style="display: block; margin-bottom: 10px; font-weight: blod"
            >标签名称:</span
          >
          <!-- <el-autocomplete
            class="inline-input"
            v-model="label"
            :fetch-suggestions="querySearch"
            placeholder="请输入内容"
            value-key="context"
            clearable
          ></el-autocomplete> -->
          <el-select v-model="label" clearable placeholder="请选择标签">
            <el-option
              v-for="item in labels"
              :key="item.id"
              :label="item.context"
              :value="item.context"
            ></el-option>
          </el-select>
        </div>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="up2" type="primary" size="small">确定</el-button>
      </span>
    </el-dialog>
    <!-- 资质查看弹框 -->
    <el-dialog title="资质查看" :visible.sync="dialogVisible888" width="1200px">
      <el-table
        :data="applyListData888"
        max-height="500"
        border
        class="table"
        ref="multipleTable1"
        header-cell-class-name="table-header"
      >
        <el-table-column
          prop="name"
          label="资质名称"
          align="center"
        ></el-table-column>
        <el-table-column label="资质生效时间" align="center" width="160">
          <template slot-scope="scope">{{ scope.row.startDate }}</template>
        </el-table-column>
        <el-table-column label="资质到期时间" align="center" width="160">
          <template slot-scope="scope">{{ scope.row.endDate }}</template>
        </el-table-column>
        <el-table-column
          label="颁证日期"
          prop="certifiedTime"
          align="center"
          width="160"
        ></el-table-column>
        <el-table-column label="证书状态" align="center" width="100">
          <template slot-scope="scope">
            <span
              class="blue1"
              v-if="
                scope.row.certificateState == '有效' ||
                  scope.row.certificateState == '使用中'
              "
              >{{ scope.row.certificateState }}</span
            >
            <span class="yellow" v-else>{{ scope.row.certificateState }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="颁证机构"
          prop="certifiedOrg"
          align="center"
        ></el-table-column>
      </el-table>
      <!-- <div class="block pageNum" style="text-align:right">
        <el-pagination
          @current-change="handleCurrentChange888"
          :page-size="10"
          layout="total, prev, pager, next"
          :current-page="pageNum888"
          :total="todelpage888"
        ></el-pagination>
      </div> -->
    </el-dialog>
    <!-- 日志查看 -->
    <logDialog
      :corporateNameTitle="corporateNameTitle"
      :logDialogVisible.sync="logDialogVisible"
      @closeDialog="logCloseDialog"
      ref="mychildlog"
    />
    <!-- 提醒 -->
    <el-dialog
      title="客户提醒列表"
      :visible.sync="viewOrderListVisible"
      width="1000px"
    >
      <div style="text-align:right">
        <el-button
          type="primary"
          @click="remindAll"
          :disabled="selectDataArrL.length == 0"
          >关闭提醒</el-button
        >
        <!-- <el-button type="dangear" @click="delAll" :disabled="selectDataArrL.length == 0">一键删除</el-button> -->
      </div>
      <el-table
        :data="orderLstData"
        class="table"
        border
        ref="table"
        :row-key="getRowKey"
        @select-all="selectAll"
        @select="selectChange"
        header-cell-class-name="table-header"
        style="margin-top:10px"
      >
        <el-table-column
          type="selection"
          :reserve-selection="true"
        ></el-table-column>
        <el-table-column
          prop="customerName"
          align="center"
          label="客户姓名"
        ></el-table-column>
        <el-table-column
          prop="companyName"
          align="center"
          width="250"
          label="客户公司"
        ></el-table-column>
        <el-table-column label="提醒时间" align="center" width="150">
          <template slot-scope="scope">{{ scope.row.remainTime }}</template>
        </el-table-column>
        <el-table-column label="状态" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.status == 0" style="color: #e66d06"
              >未提醒</span
            >
            <span v-if="scope.row.status == 1" style="color: green"
              >已提醒</span
            >
          </template>
        </el-table-column>
        <el-table-column
          prop="remark"
          align="center"
          label="备注"
        ></el-table-column>
        <el-table-column label="操作" min-width="270" align="center">
          <template slot-scope="scope">
            <!-- <el-button @click="handleOrderListRemind(scope.$index,scope.row)" type="warning" icon="el-icon-check" size="mini">已提醒</el-button> -->
            <el-button
              type="success"
              size="mini"
              @click="handleOrderListEdit(scope.$index, scope.row)"
              >更新提醒</el-button
            >
            <el-button
              type="primary"
              size="mini"
              @click="handleViewLog(scope.$index, scope.row, '2')"
              >小记</el-button
            >
            <el-button
              type="danger"
              size="mini"
              @click="handleOrderListDelete(scope.$index, scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <el-pagination
          background
          layout="total, prev, pager, next"
          :current-page="orderParams.pageNum"
          :page-size="orderParams.pageSize"
          :total="orderParamsTotal"
          @current-change="orderPageChange"
        ></el-pagination>
      </div>
    </el-dialog>
  </div>
</template>
<script>
// import {mapGetters, mapActions, mapState, mapMutations} from "vuex";
import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
import {
  allDelN,
  callNumberN,
  getListN,
  execlSubmitFormN,
  handleOrderListDeleteN,
  getRemainsN,
  orderSubmitFormN,
  deleteDataN,
  getData00N,
  uploadFile1N,
  submitAptitudeFormN,
  submitAptitudeForm2N,
  updateN,
  recordN,
  downLoadPan1N,
  submitFormaddN,
  getLabelsN,
  userList,
  addRecordN,
  exportNeiN,
  validateEmailN,
  getcity,
  pidGet,
  getDistrict,
  cityName
} from "@/api/systemSettings/customerManagement";
import { edreserveN } from "@/api/index";
import { listUser } from "@/api/systemSettings/resource";
import { listN } from "@/api/systemSettings/grade";
import { listUser1 } from "@/api/system/user";

import logDialog from "./logDialogN.vue";
// import contractDialog from "./contractDialog.vue";
export default {
  components: { logDialog },
  data() {
    return {
      // 转移
      // 修改记录
      loadingE: false,
      recordData: [],
      translateVisible: false,
      peopleLists: [],
      moveUser: undefined,
      paramsRecord: {
        pageNum: 1,
        pageSize: 10
      },
      edPageTotal: 0,
      customerId: "",
      // 选中数组
      ids: [],
      pidList: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      labels: [],
      cont: undefined,
      sysUserList: [],
      label: "",
      uploadFile666: {},
      dialogVisible555: false,
      dialogVisible666: false,
      dialogVisible888: false,
      applyListData888: [],
      // pageNum888:1,
      // todelpage888:0,
      uploading: false,
      openFlag: true,
      title666: "",
      addVisible: false,
      del: false,
      uploadList: [],
      selectDataArrL: [],
      loading: true,
      //tHeight:document.body.offsetHeight - 350,
      //数据
      tableData: [],
      tableHeight: 0,
      // 参数
      paramsFlag: 0,
      params: {
        pageNum: 1,
        pageSize: 10,
        userId: 1,
        companyName: "",
        customerName: "",
        customerPhone: "",
        landlinePhone: "",
        city: "",
        email: "",
        grade: "",
        source: "",
        day: null,
        relation: null,
        label: "",
        customerRole: "",
        userName: "",
        officialWebsite: "",
        ids: ""
      },
      pageTotal: 0,
      orderParamsTotal: 0,
      dialogVisible: false, // 是否展示编辑页面
      // 数据
      formData: {},
      dialogStatus: 0,
      //资质查看
      viewDialogVisible: false,
      //日志查看
      logDialogVisible: false,
      //合同列表
      logDiaContractVisible: false,
      stateList: [
        {
          id: 1,
          title: "已合作"
        },
        {
          id: 2,
          title: "有意向"
        },
        {
          id: 3,
          title: "待开发"
        }
      ],
      moveStatList: [
        {
          id: 0,
          title: "正常"
        },
        {
          id: 1,
          title: "待迁移"
        }
      ],
      levelList: [],
      levelList3: [],
      levelList5: [],
      levelList2: [
        // {
        //   id: "0",
        //   title: "未知",
        // },
        {
          id: "1",
          title: "新客户"
        },
        {
          id: "2",
          title: "老客户"
        }
      ],
      qccQuery: [
        {
          id: true,
          title: "已查"
        },
        {
          id: false,
          title: "未查"
        }
      ],
      //转移申请
      rules: {
        targetUid: [
          { required: true, message: "请输入被转移人", trigger: "change" }
        ],

        type: [
          { required: true, message: "请选择申请类型", trigger: "change" }
        ],
        ids: [{ required: true, message: "请选择转移客户", trigger: "change" }],
        remainTime: [
          { required: true, message: "请选择预约时间", trigger: "change" }
        ],
        ExeclParams: [
          {
            required: true,
            message: "客户资源导出数量不能为空",
            trigger: "blur"
          }
        ]
      },
      rules2: {
        // landlinePhone: [
        //   { required: true, message: "请输入座机电话", trigger: "change" },
        // ],
        // email: [
        //   { required: true, message: "邮箱地址不能为空", trigger: "blur" },
        //   {
        //     type: "email",
        //     message: "'请输入正确的邮箱地址",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        country: [{ required: true, message: "请选择省份", trigger: "blur" }],
        city: [{ required: true, message: "请选择城市", trigger: "blur" }],
        customerPhone: [
          { required: true, message: "请输入联系电话", trigger: "blur" }
        ],
        companyName: [
          { required: true, message: "请输入公司名称", trigger: "blur" }
        ],
        customerName: [
          { required: true, message: "请输入联系人", trigger: "blur" }
        ],
        // address: [
        //   { required: true, message: "请输入地址", trigger: "blur" },
        // ],
        customerRole: [
          { required: true, message: "请选择客户类型", trigger: "blur" }
        ],
        grade: [{ required: true, message: "请选择客户等级", trigger: "blur" }],
        customerType: [
          { required: true, message: "请选择新老客户", trigger: "blur" }
        ],
        source: [{ required: true, message: "请输入客户来源", trigger: "blur" }]
      },
      isLogin: false,
      applyVisible: false,
      applyData: {
        //   sourceUid:JSON.parse( localStorage.getItem('adminData') ).id,
        type: "",
        targetUid: "",
        ids: "",
        reason: ""
      },
      typeList: [
        {
          title: "部分转移",
          id: 1
        },
        {
          title: "全部转移",
          id: 2
        }
      ],
      typeList1: [
        {
          id: "1",
          title: "新客户"
        },
        {
          id: "2",
          title: "老客户"
        }
      ],
      //查看申请
      viewApplyVisible: false,
      // adminId:JSON.parse( localStorage.getItem('adminData') ).id,
      ApplyListParams: {
        pageNum: 1,
        pageSize: 10
      },
      applyListData: [],
      applyListPage: 0,
      statelList: [
        {
          id: "0",
          title: "未审核"
        },
        {
          id: "1",
          title: "通过"
        },
        {
          id: "2",
          title: "拒绝"
        }
      ],
      applyDetailVisible: false,
      customerListParams: {
        pageNum: 1,
        pageSize: 10
      },
      customerListParamsTotal: 0,
      customerListDataMore: [],
      statusData: [
        {
          id: 0,
          title: "未审核"
        },
        {
          id: 1,
          title: "已审核"
        },
        {
          id: 2,
          title: "全部"
        }
      ],
      status: "",
      //客户预约
      orderVisible: false,
      orderData: {},
      orderDialogStatus: "",
      viewOrderListVisible: false,
      orderLstData: [],
      messageContent: "",
      //表格导出
      ExeclParamsdata: {
        ExeclParams: ""
      },
      addExeclVisible: false,
      editFlags: false,
      // 转移人员
      transferPeopleParams: {
        pageNum: 1,
        pageSize: 10,
        companyName: "",
        realName: "",
        grade: ""
      },
      options: [],
      corporateNameTitle: "",
      contractFlag: true,
      options1: [],
      options2: [],
      options3: [],
      orderParams: {
        pageNum: 1,
        pageSize: 10
      },
      translate_data: {},
      // 转移人、被转移人列表
      sysUserList: [],
      prop: "updateTime",
      sort: "descending"
    };
  },
  computed: {},
  created() {
    // if (this.$route.params.id && !this.$route.params.userName) {
    //   console.log(this.$route.params.id, "当前id优质");
    //   this.params.grade = this.$route.params.id;
    //   this.getData00N();
    // } else if (!this.$route.params.id && this.$route.params.userName) {
    //   this.params.nickName = this.$route.params.userName;
    //   this.getData00N();
    // } else {
    //   this.getData00N();
    // }
    if (this.$route.params.id) {
      this.params.grade = this.$route.params.id;
      this.getData00N();
    } else if (this.$route.params.day) {
      this.params.day = this.$route.params.day;
      this.params.relation = "0";
      this.getData00N();
    } else {
      this.getData00N();
    }
    this.getDicts("qudao1").then(res => {
      this.levelList5 = res.data;
      // console.log(res.data, "yuanshi");
      // console.log(this.levelList5,'12')
    });
    this.getSysUserList();
    this.getPidList();
    // this.getRemains();
  },
  mounted() {
    this.$nextTick(function() {
      this.tableHeight =
        window.innerHeight - this.$refs.multipleTable.$el.offsetTop - 150;
      let self = this;
      window.onresize = function() {
        self.tableHeight =
          window.innerHeight - self.$refs.multipleTable.$el.offsetTop - 150;
      };
    });
    this.getDicts("cusNei").then(response => {
      this.levelList3 = response.data;
    });

    this.peopleList();
    this.getLabels();
    this.grades();
    // this.getList();
  },
  watch: {},
  filters: {
    formatDate: function(value) {
      /* let date = new Date(parseInt(value) * 1000);
        let y = date.getFullYear();
        let m = date.getMonth() + 1;
        m = m < 10 ? "0" + m : m;
        let d = date.getDate();
        d = d < 10 ? "0" + d : d;
        return y+'-'+m + "-" + d;*/
      let date = new Date(parseInt(value) * 1000);
      let y = date.getFullYear();
      let m = date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      let d = date.getDate();
      d = d < 10 ? "0" + d : d;
      let h = date.getHours();
      h = h < 10 ? "0" + h : h;
      let minute = date.getMinutes();
      let second = date.getSeconds();
      minute = minute < 10 ? "0" + minute : minute;
      second = second < 10 ? "0" + second : second;
      return y + "-" + m + "-" + d + " " + h + ":" + minute + ":" + second;
    }
  },
  methods: {
    checkPermi,
    checkRole,
    getPidList() {
      pidGet().then(res => {
        if (res.code == 200) {
          this.pidList = res.rows;
        }
      });
    },
    changeAddress(id, type) {
      if (type == 1) {
        this.formData.city = "";
        this.options2 = [];
        this.getCityName(id, 2);
      }
    },
    changeAddress1(id, type) {
      if (type == 1) {
        this.formData.district = "";
        this.options3 = [];
        this.getDistrict(id);
      }
    },
    edPageChange(val) {
      this.paramsRecord.pageNum = val;
      recordN({
        customerId: this.customerId,
        pageSize: this.paramsRecord.pageSize,
        pageNum: this.paramsRecord.pageNum
      }).then(res => {
        if (res.code == 200) {
          this.recordData = res.rows;
          this.edPageTotal = res.total;
        } else {
          this.recordData = [];
          this.edPageTotal = 0;
        }
      });
    },
    getRowKey(row) {
      return row.id;
    },
    remindAll() {
      let i = this.selectDataArrL.map(item => {
        return item.id;
      });
      edreserveN(i).then(res => {
        if (res.code == "200") {
          this.$refs.table.clearSelection();
          this.getRemains();
          this.$message.success("操作成功");
        } else {
          this.$message.error("操作失败");
        }
      });
    },
    getCityName(id, type) {
      cityName({ cityName: id }).then(res => {
        if (res.code == 200) {
          this.options2 = res.data;
        }
      });
    },
    // 区域
    getcity(id) {
      getcity(id).then(res => {
        if (res.code == 200) {
          this.options1 = res.data;
        }
      });
    },
    getDistrict(id) {
      getDistrict({ cityName: id }).then(res => {
        if (res.code == 200) {
          this.options3 = res.data;
        }
      });
    },
    handleSortChange({ column, prop, order }) {
      let data = JSON.parse(JSON.stringify(this.params));
      this.prop = { prop }.prop;
      this.sort = { order }.order;
      data["clouname"] = this.prop;
      data["sort"] = this.sort;
      getData00N(data)
        .then(res => {
          if (res.code == "200") {
            this.tableData = res.rows;
            this.pageTotal = res.total;
            this.loading = false;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          return false;
        });
    },
    selectChange(arr, row) {
      this.selectDataArrL = arr;
    },
    selectAll(arr) {
      if (arr.length > 0) {
        this.selectDataArrL = arr;
      }
    },
    toSameCustomer() {
      this.$router.push({ path: "/sameCustomerNei" });
    },
    yanzheng() {
      if (this.formData.email) {
        validateEmailN({ emails: this.formData.email }).then(res => {
          if (res.code == 200) {
            this.$message.success("邮箱验证通过");
          } else {
            this.$message.danger(res.data.message);
          }
        });
      } else {
        return this.$message.error("邮箱不能为空");
      }
    },
    getSysUserList() {
      listUser1({
        pageNum: 1,
        pageSize: 1000
      }).then(res => {
        this.sysUserList = res.rows;
      });
    },
    smallTime(val) {
      return val.substring(0, 10);
    },
    change123(e) {
      console.log(e);
      console.log(this.formData.source);
    },
    translate_sub() {
      let userId = localStorage.getItem("useId");
      let customerId = this.translate_data.id || this.ids;
      addRecordN({
        moveUser: this.moveUser,
        customerIds: customerId,
        userId: userId
      }).then(res => {
        if (res.code == 200) {
          this.$message.success("转移申请已提交");
          this.ids = [];
          this.translateVisible = false;
          this.getData00N();
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    /** 查询用户列表 */
    peopleList() {
      userList({
        pageNum: 1,
        pageSize: 500
      }).then(response => {
        this.peopleLists = response.data;
      });
    },
    translate(row) {
      this.translateVisible = true;
      this.translate_data = row;
      console.log(row);
    },
    // handleCurrentChange888(e){
    //   this.pageNum888=e
    // },
    // 获取客户等级
    grades() {
      listN({
        pageNum: 1,
        pageSize: 100
      }).then(response => {
        console.log(response);
        this.levelList = response.rows;
      });
    },
    querySearch(queryString, cb) {
      console.log(queryString, this.labels);
      var restaurants = this.labels;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.context
            .toLowerCase()
            .indexOf(queryString.toLowerCase()) === 0
        );
      };
    },
    getLabels() {
      getLabelsN({
        pageNum: 1,
        pageSize: 9999
      }).then(res => {
        if (res.code == 200) {
          this.labels = res.rows;
        }
      });
    },
    jilu(id1, id2) {
      submitFormaddN({
        content: this.cont,
        customerId: id1,
        userId: id2
      }).then(res => {
        if (res.code == 200) {
          this.cont = undefined;
          console.log("保存记录成功");
        }
      });
    },
    getSysUserList() {
      listUser().then(res => {
        this.sysUserList = res.rows;
      });
    },
    downLoadPan() {
      // console.log("模板下载");
      this.$confirm("是否确认导出模板?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(function() {
          console.log("1");
          return downLoadPan1N();
        })
        .then(response => {
          console.log(response);
          this.download(response.msg);
        })
        .catch(function() {});
    },
    export1() {
      this.$confirm("是否确认导出客户资源?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return exportNeiN(this.params);
        })
        .then(response => {
          console.log(response);
          this.download(response.msg);
        })
        .catch(function() {});
    },
    qccQueryCount(index, row) {
      if (row.qccQueryCount == 0) {
        console.log("暂无资质");
      } else {
        this.dialogVisible888 = true;
        this.applyListData888 = row.certificateInfo;
      }
    },
    close666() {
      this.uploadFile666 = {};
      this.uploadList = [];
    },
    // 最新新增
    submitForm() {
      console.log(this.formData, "biaoda");
      this.$refs["ruleForm"].validate(valid => {
        if (valid) {
          if (!this.formData.id) {
            // this.formData.country = "中国";
            // this.formData.continent = "亚洲";
            submitAptitudeFormN(this.formData).then(res => {
              console.log(res);
              if (res.code == 200) {
                this.$message.success(`新增成功`);
                this.dialogVisible = false;
                this.getData00N();
              }
            });
          } else {
            console.log(this.formData);
            updateN(this.formData).then(res => {
              if (res.code == 200) {
                // this.jilu(this.formData.id, this.formData.userId);
                this.$message.success(`修改成功`);
                this.dialogVisible = false;
                this.uploading = false;
                this.getData00N();
              }
            });
          }
        }
      });
    },
    allDel(index) {
      if (index == 1) {
        if (this.params.grade == "") {
          this.$message.error(`请在搜索栏中选择想要删除的客户等级!`);
        } else {
          this.$confirm("确定要删除该标签内所有客户信息？", "危险操作", {
            type: "warning"
          })
            .then(() => {
              allDelN({
                grade: this.params.grade
              }).then(res => {
                if (res.code == "200") {
                  this.$message.success(`删除成功`);
                  this.params.grade = "";
                  this.getData00N();
                } else {
                  this.$message.error(`删除失败`);
                }
              });
            })
            .catch(() => {});
        }
      } else if (index == 2) {
        if (this.params.label == "") {
          this.$message.error(`请输入或者选择标签的完整名称!`);
        } else {
          this.$confirm("确定要删除该等级内所有客户信息？", "危险操作", {
            type: "warning"
          })
            .then(() => {
              allDelN({
                label: this.params.label
              }).then(res => {
                if (res.code == "200") {
                  this.$message.success(`删除成功`);
                  this.params.allDel = "";
                  this.getData00N();
                } else {
                  this.$message.error(`删除失败`);
                }
              });
            })
            .catch(() => {});
        }
      }
    },
    //申请转移列表select
    /*    getSelectData(){
        this.transferPeopleParams={
            page: 1,
            pageSize: 10,
            companyName:"",
            realName:'',
            grade:''
        }
        this.applyData.ids=[];
        this.getList();
   }, */
    // remoteMethod(query) {
    //   this.options = [];
    //   this.transferPeopleParams.pageNum = 1;
    //   if (query !== "") {
    //     this.transferPeopleParams.companyName = query;
    //     this.getList();
    //   } else {
    //     this.transferPeopleParams.companyName = "";
    //     this.getList();
    //   }
    // },
    // loadmore() {
    //   this.transferPeopleParams.pageNum++;
    //   this.getList();
    // },
    // getList(formData) {
    //   getList(this.transferPeopleParams).then((res) => {
    //     if (res.code == "200") {
    //       if (res.data.results == null) res.data.results = [];
    //       this.options = [...this.options, ...res.data.results];
    //     }
    //   });
    // },
    // 预约列表
    diaAppointment() {
      this.viewOrderListVisible = true;
      this.getRemains();
    },
    getRemains() {
      getRemains(this.orderParams).then(res => {
        this.orderLstData = res.rows;
        this.orderParamsTotal = res.total;
      });
    },
    //execl导出数量
    execlSubmitForm(formName) {
      var _this = this;
      this.$refs[formName].validate(valid => {
        if (valid) {
          let data = this.params;
          if (this.paramsFlag == 0) {
            data.pageSize = this.ExeclParamsdata.ExeclParams;
          } else {
            data.pageSize = this.ExeclParamsdata.ExeclParams;
          }

          execlSubmitFormN(data)
            .then(res => {
              if (res.code == "200") {
                if (res.data.results == null) res.data.results = [];
                this.loading = false;

                if (res.data.results.length != 0) {
                  for (var i = 0; i < res.data.results.length; i++) {
                    if (res.data.results[i].grade == 1) {
                      res.data.results[i].levelContent = "D级（未开发）";
                    } else if (res.data.results[i].grade == 2) {
                      res.data.results[i].levelContent = "A级（已合作）";
                    } else if (res.data.results[i].grade == 3) {
                      res.data.results[i].levelContent = "B级（有意向）";
                    } else if (res.data.results[i].grade == 4) {
                      res.data.results[i].levelContent = "C级（已开发）";
                    }
                  }
                }

                require.ensure([], () => {
                  const {
                    export_json_to_excel
                  } = require("../../../assets/vendor/Export2Excel");
                  const tHeader = [
                    "客户名称",
                    "公司名称",
                    "客户等级",
                    "联系方式",
                    "地址",
                    "最近跟进人"
                  ];
                  const filterVal = [
                    "customerName",
                    "companyName",
                    "levelContent",
                    "customerPhone",
                    "addr",
                    "realName"
                  ];
                  const list = res.data.results;
                  const data = this.formatJson(filterVal, list);
                  export_json_to_excel(tHeader, data, "客户表");
                });

                this.addExeclVisible = false;
                this.ExeclParamsdata.ExeclParams = "";
              }
            })
            .catch(() => {
              console.log("error submit!!");
              return false;
            });
        }
      });
    },
    export2Excel() {
      this.addExeclVisible = true;
      this.ExeclParamsdata.ExeclParams = "";
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]));
    },
    //客户预约
    handleOrderListEdit(index, row) {
      this.orderVisible = true;
      this.orderData = {
        remainTime: row.remainTime,
        remark: row.remark,
        customerId: row.customerId
      };
      this.orderDialogStatus = "更新预约";
    },
    handleOrderListDelete(index, row) {
      this.$confirm("此操作将永久删除该记录, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          handleOrderListDeleteN(row.id).then(res => {
            if (res.code == "200") {
              this.$message({
                type: "success",
                message: "删除成功!"
              });
              this.getRemains();
            } else {
              this.$message({
                type: "info",
                message: "删除失败!"
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    viewOrderList() {
      this.viewOrderListVisible = true;
      this.getRemains();
    },
    getRemains() {
      getRemainsN(this.orderParams).then(res => {
        this.orderLstData = res.rows;
        this.orderParamsTotal = res.total;
      });
    },
    orderPageChange(val) {
      this.$set(this.orderParams, "pageNum", val);
      this.getRemains();
    },
    handleOrder(index, row) {
      this.orderVisible = true;
      this.orderData = {
        remainTime: "",
        remark: "",
        customerId: row.id
      };
      this.orderDialogStatus = "新增预约";
    },
    orderSubmitForm(formName) {
      var _this = this;
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.isLogin = true;
          console.log(this.orderData);
          orderSubmitFormN(this.orderData)
            .then(res => {
              if (res.code != 200) {
                setTimeout(() => {
                  this.isLogin = false;
                  this.$message.error(`${this.orderDialogStatus}失败`);
                }, 0.1 * 1000);
              } else {
                setTimeout(() => {
                  this.isLogin = false;
                  this.$message.success(`${this.orderDialogStatus}成功`);
                  this.orderVisible = false;
                  this.getRemains();
                }, 0.1 * 1000);
              }
            })
            .catch(() => {
              this.isLogin = false;
            });
        }
      });
    },
    handleChange(params) {
      if (params == 2) {
        this.status = "";
      } else {
        this.status = params;
      }
      this.viewApply();
    },
    // 分页导航
    handleCustomerPageChange(val) {
      this.$set(this.customerListParams, "pageNum", val);
      //  this.customerListData()
    },
    //查看申请
    viewApply() {
      this.viewApplyVisible = true;
      if (this.adminId == 1) {
        //管理员
        this.ApplyListParams.sourceUid = "";
        this.ApplyListParams.status = this.status; //要查询
      } else {
        //员工
        this.ApplyListParams.status = "";
        this.ApplyListParams.sourceUid = this.adminId;
      }
      //           this.$axios.post("/customerApply/getApplyList", this.ApplyListParams)
      //               .then((res) => {
      //                this.applyListData=res.data.results;
      //                this.applyListPage=res.data.count;
      //           })
    },
    // 分页导航
    handleApplyPageChange(val) {
      this.$set(this.ApplyListParams, "pageNum", val);
      this.viewApply();
    },
    //提交申请
    // allApply() {
    //   this.applyVisible = true;
    //   this.applyData = {
    //     sourceUid: JSON.parse(localStorage.getItem("adminData")).id,
    //     type: "",
    //     targetUid: "",
    //     ids: "",
    //     reason: "",
    //   };
    // },
    //编辑页面弹窗
    handleViewApply(index, row) {
      this.applyDetailVisible = true;
      this.customerListParams.applyId = row.id;
      //   this.customerListData()
    },
    //       customerListData(){
    //            this.$axios.post("/customerApply/getCustomerList", this.customerListParams)
    //                         .then((res) => {
    //                  this.customerListDataMore=res.data.results;
    //                  this.customerListParamsTotal=res.data.count;
    //            })
    //       },
    //       getSysUserList(){
    //           this.$axios.get('/customerApply/getSysUserList')
    //                 .then((res) => {
    //                   this.sysUserList=res.data;
    //             })
    //       },
    formatState(val) {
      var str = this.statelList.find(function(item) {
        return item.id == val;
      });
      if (str) return str.title;
    },
    //   appleSubmitForm(formName) {
    //         var _this=this;
    //         if(this.applyData.ids.length != 0)  this.applyData.ids= this.applyData.ids.join(',');
    //         this.$refs[formName].validate((valid) => {
    //             if (valid) {
    //             this.isLogin = true;
    //             this.$axios.post("/customerApply/apply", this.applyData)
    //                     .then((res) => {
    //                         if(res.code!=200){
    //                             setTimeout(() =>{
    //                                 this.isLogin = false;
    //                                 this.$message.success(`提交失败`);
    //                             }, 0.1 * 1000 );
    //                         }else{
    //                         setTimeout(() =>{
    //                                 this.isLogin = false;
    //                                 this.$message.success(`提交成功`);
    //                                 this.applyVisible = false;
    //                             }, 0.1 * 1000 );
    //                         }
    //                 })
    //                 .catch(() => {
    //                     this.isLogin = false;
    //                 });
    //             }
    //         });
    //  },
    openSearch() {
      this.openFlag = !this.openFlag;
      this.params = {
        pageNum: 1,
        pageSize: 10,
        userId: 1,
        companyName: "",
        customerName: "",
        customerPhone: "",
        landlinePhone: "",
        city: "",
        email: "",
        grade: "",
        source: "",
        day: null,
        relation: null,
        label: "",
        customerRole: "",
        userName: "",
        officialWebsite: "",
        ids: ""
      };
    },
    formatLevel(val) {
      var str = this.levelList.find(function(item) {
        return item.gradeValue == val;
      });
      if (str) return str.gradeName;
    },
    formatRole(val) {
      var str = this.levelList3.find(function(item) {
        return item.dictValue == val;
      });
      if (str) return str.dictLabel;
    },
    formatSource(val) {
      var str = this.levelList5.find(function(item) {
        return item.dictValue == val;
      });
      if (str) return str.dictLabel;
    },
    formatType(val) {
      var str = this.levelList2.find(function(item) {
        return item.id == val;
      });
      if (str) return str.title;
    },
    formatState(val) {
      var str = this.stateList.find(function(item) {
        return item.id == val;
      });
      if (str) return str.title;
    },
    cancelData() {
      this.params = {
        pageNum: 1,
        pageSize: 10,
        userId: 1,
        companyName: "",
        customerName: "",
        customerPhone: "",
        landlinePhone: "",
        city: "",
        email: "",
        grade: "",
        source: "",
        day: null,
        relation: null,
        label: "",
        customerRole: "",
        userName: "",
        cancelData: "",
        ids: ""
      };
      this.getData00N();
    },
    //合同列表
    handleViewContract(index, row) {
      this.logDiaContractVisible = true;
      this.$refs.mychildlContract.getDataMoreN(row.id);
      this.corporateNameTitle = row.companyName;
      this.contractFlag = true;
    },
    //关闭合同列表弹窗
    contractCloseDialog() {
      this.logDiaContractVisible = false;
    },
    //日志查看
    handleViewLog(index, row) {
      this.logDialogVisible = true;
      this.$refs.mychildlog.getDataMoreN(row.id);
      this.corporateNameTitle = row.companyName;
    },
    //关闭日志查看弹窗
    logCloseDialog() {
      this.logDialogVisible = false;
      this.getData00N();
    },
    //资质查看
    handleView(index, row) {
      this.viewDialogVisible = true;
      this.$refs.mychild.getDataMoreN(row.id);
      this.corporateNameTitle = row.companyName;
    },
    //关闭资质查看弹窗
    viewCloseDialog() {
      this.viewDialogVisible = false;
    },
    // 删除操作
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id);
      console.log(this.ids);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    delAllSelection(row) {
      const id = row.id || this.ids;
      this.$confirm("是否确认删除?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(function() {
          return deleteDataN(id);
        })
        .then(() => {
          this.getData00N();
          this.msgSuccess("删除成功");
        })
        .catch(function() {});
    },
    // 触发搜索按钮
    search() {
      this.$set(this.params, "pageNum", 1);
      this.paramsFlag = 0;
      if (this.params.day) {
        this.params.relation = "0";
      } else {
        this.params.relation = "";
      }
      this.getData00N();
    },
    //新增页面弹窗
    handleAdd() {
      this.getcity(1, 1);
      this.formData = {
        companyName: "",
        customerName: "",
        customerPhone: "",
        customerRole: "",
        email: "",
        officialWebsite: "",
        landlinePhone: "",
        grade: "",
        customerType: "",
        label: "",
        source: "",
        address: "",
        country: "",
        city: "",
        district: "",
        remark: ""
      };
      this.title666 = "新增";
      this.dialogVisible = true;
    },
    handleEdit(index, row) {
      this.title666 = "修改";
      submitAptitudeForm2N(row.id).then(res => {
        if (res.code == 200) {
          // console.log(res);
          this.formData = res.data;
          this.getcity(1, 1);
          this.getCityName(this.formData.country, 2);
          // if(this.formData.district != null && this.formData.district != ''){
          this.getDistrict(this.formData.city);
          // }
          this.logEdit(res.data.id);
          // this.getcity(this.formData.country,2)
        } else {
          this.$message.error(res.msg);
        }
        this.$nextTick(() => {
          // dom元素更新后执行，因此这里能正确打印更改之后的值
          this.dialogVisible = true;
        });
      });
    },
    // 打开修改记录弹窗
    logEdit(id) {
      // this.loadingE = true
      this.edPageTotal = 0;
      this.paramsRecord = {
        pageSize: 10,
        pageNum: 1
      };
      // this.customerId = row.id
      this.customerId = id;
      recordN({
        customerId: this.customerId,
        pageSize: this.paramsRecord.pageSize,
        pageNum: this.paramsRecord.pageNum
      }).then(res => {
        if (res.code == 200) {
          this.recordData = res.rows;
          this.edPageTotal = res.total;
        } else {
          // this.loadingE = false
          this.recordData = [];
          this.edPageTotal = 0;
        }
      });
      // this.edDialog = true;
    },
    //编辑页面弹窗
    closeDialog() {
      this.dialogVisible = false;
    },
    //获取数据
    getData00N() {
      if (!this.params.userId) {
        this.params.userId = 1;
      }
      let data = JSON.parse(JSON.stringify(this.params));
      data["clouname"] = this.prop;
      data["sort"] = this.sort;
      getData00N(data)
        .then(res => {
          console.log(res, "客户管理列表");
          if (res.code == "200") {
            this.tableData = res.rows;
            this.pageTotal = res.total;
            this.loading = false;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          return false;
        });
    },
    // 分页导航
    handlePageChange(val) {
      this.$set(this.params, "pageNum", val);
      this.getData00N();
    },
    fileExceed() {
      this.$message.error("别贪心！一次只能上传一个哦~");
    },

    // 请求成功
    importSuccess(res) {
      // 后端的返回码--上传成功
      if (res.code == "200") {
        // 显示√图标
        let e = document.getElementsByClassName(
          "el-upload-list__item-status-label"
        );
        e[0].setAttribute("style", "display:block !important");
        // 成功提示
        this.$message.success("上传成功");
        // 重新调用列表请求（代码略）
        this.getList();
        // 后端的返回码--上传失败
      } else {
        // 隐藏√图标
        let e = document.getElementsByClassName(
          "el-upload-list__item-status-label"
        );
        e[0].setAttribute("style", "display:none !important");
        // 失败提示--及后端返回的失败详情
        this.$message.error({
          dangerouslyUseHTMLString: true,
          duration: 4500,
          message: res.remark + ",<br/>请删除上传失败的文件，修改后重新上传"
        });
      }
    },
    // 增加标签
    // up() {
    //   this.dialogVisible555 = false;
    //   let item = this.uploadFile666;
    //   const form = new FormData();
    //   form.append("upfile", item.file);
    //   this.uploading = true;
    //   console.log(form);
    //   uploadFile1(0, this.label, form)
    //     .then((res) => {
    //       if (res.code == "200") {
    //         this.$message.success(`数据导入成功`);
    //         this.uploading = false;
    //         this.getData00N();
    //       } else {
    //         this.$message.error(`${res.message}`);
    //         this.messageContent = res.message;
    //       }
    //     })
    //     .catch(() => {
    //       console.log("error submit!!");
    //       this.uploading = false;
    //       return false;
    //     });
    // },
    up2() {
      this.dialogVisible666 = false;
      let item = this.uploadFile666;
      const form = new FormData();
      form.append("upfile", item.file);
      this.uploading = true;
      console.log(form);
      uploadFile1N(1, this.label, form)
        .then(res => {
          if (res.code == "200") {
            this.$message.success(`数据导入成功`);
            this.uploading = false;
            this.getData00N();
          } else {
            this.$message.error(`${res.message}`);
            this.messageContent = res.message;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          this.uploading = false;
          return false;
        });
    },
    // 自定义上传
    uploadFile1(item) {
      console.log(item);
      this.dialogVisible555 = true;
      this.uploadFile666 = item;
      //   const form = new FormData();
      // form.append("upfile", item.file);
      // this.uploading=true
      // uploadFile1(1,this.label,form)
      //   .then((res) => {
      //     if (res.code == "200") {
      //       this.$message.success(`数据导入成功`)
      //       this.uploading=false
      //       this.getData00N();
      //     } else {
      //       this.$message.error(`${res.message}`);
      //       this.messageContent = res.message;
      //     }
      //   })
      //   .catch(() => {
      //     console.log("error submit!!");
      //     this.uploading=false
      //     return false;
      //   });
    },
    uploadFile2(item) {
      console.log(item);
      this.dialogVisible666 = true;
      this.uploadFile666 = item;
    }
  }
};
function formatDate(value) {
  let date = new Date(parseInt(value) * 1000);
  let y = date.getFullYear();
  let m = date.getMonth() + 1;
  m = m < 10 ? "0" + m : m;
  let d = date.getDate();
  d = d < 10 ? "0" + d : d;
  return y + "-" + m + "-" + d;

  /*  let date = new Date(parseInt(value) * 1000)
    let y = date.getFullYear();
    let m = date.getMonth() + 1;
    m = m < 10 ? ('0' + m) : m;
    let d = date.getDate();
    d = d < 10 ? ('0' + d) : d;
    let h = date.getHours();
    h = h < 10 ? ('0' + h) : h;
    let minute = date.getMinutes();
    let second = date.getSeconds();
    minute = minute < 10 ? ('0' + minute) : minute;
    second = second < 10 ? ('0' + second) : second;
    return  y + '-' + m + '-' + d + ' '+ h + ':' + minute + ':' + second*/
}
</script>

<style scoped>
.container {
  padding: 0 20px !important;
}
.timeDate .el-date-editor {
  width: 50%;
  float: left;
}
.handle-box .el-button + .el-button {
  margin-left: 0px !important;
}
.form-box,
.el-select {
  width: 100% !important;
}
.handle-box {
  margin-bottom: 10px;
}

.handle-select {
  width: 120px;
}

.handle-input {
  width: 300px;
  display: inline-block;
}
.table {
  width: 100%;
  font-size: 14px;
}

.yellow {
  color: #f57506;
}
.green {
  color: green;
  cursor: pointer;
}
.red {
  color: #ff0000;
}
.blue {
  color: #409eff;
  cursor: pointer;
  text-decoration: underline;
}
.blue1 {
  color: #409eff;
}
.mr10 {
  margin-right: 10px;
}
.table-td-thumb {
  display: block;
  margin: auto;
  width: 40px;
  height: 40px;
}
.search-box {
  margin-bottom: 10px;
  padding: 10px 10px 10px 10px;
  border-radius: 4px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 5px;
}
.searchForm .el-form-item--mini.el-form-item,
.searchForm .el-form-item--small.el-form-item {
  margin-bottom: 1px;
}
</style>
